
// 创建路由表
import { createRouter, createWebHashHistory, createWebHistory } from 'vue-router'

// 2. 创建路由表 =》 根据路由信息找到组件 关系表
let routes = [
    {
        path: '/',
        meta: {
            token: false  //为假，表示是外部页面
        },        
        // component: () => import('../views/Login/ayindex.vue')  //异步组件
        component: () => import('../views/Login/index.vue')
    },
    {
        path: '/layout',
        redirect:'/layout/home', //路由重定向，一进入，就显示home页面
        meta: {
            token: true  //为真，表示是内部页面
        },
        component: () => import('../layout/index.vue'),
        children:[
            // 1. 谁是父亲  2. 注意路径 =》 拼接
            //  路径是/layout/home，渲染关系是先 /layout 后/home 会(先父级 后子级)
            {
                path:'home',
                meta:{
                    name:[{name:'首页'}],
                    title:'首页',
                },
                component:()=> import('@/views/Home/index.vue')},
            // ### 路由懒加载
            // 特点： 用户首次进入项目时，不会加载 采用了路由懒加载的组件，只有用户进入到这个组件才会加载
            // 本质： promise =》 异步方法来进行处理
            {
                path:'work',
                meta:{
                    name:[{name:'工作台'}],
                    title:'工作台',
                },
                component:()=> import('@/views/Work/index.vue')
            },
            {
                // 侧边栏导航的 有嵌套的组件
                path:'echarts',
                meta:{ //  meta里 可以放一些 私有的路由信息
                    name:[{name:'组件'},{nane:'图表'}],
                    title:'图表',
                },
                component:()=> import('@/views/Echarts/index.vue')
            },
            {
                // 侧边栏导航的 有嵌套的组件
                path:'message',
                meta:{ //  meta里 可以放一些 私有的路由信息
                    name:[{name:'组件'},{name:'message'}],
                    title:'message',
                },
                component:()=> import('@/views/Message/index.vue')
            },           
                      
            {
                // 侧边栏导航的 有嵌套的组件
                path:'play',
                meta:{
                    name:[{name:'课程管理'},{name:'直播'}],
                    title:'直播',
                },
                component:()=> import('@/views/CourseManagement/Play/index.vue')
            },
            {
                // 侧边栏导航的 有嵌套的组件
                path:'video',
                meta:{
                    name:[{name:'课程管理'},{name:'视频'}],
                    title:'视频',
                },
                component:()=> import('@/views/CourseManagement/Video/index.vue')
            },
            {
                path:'finance',
                meta:{
                    name:[{name:'财务'}],
                    title:'财务',
                },
                component:()=> import('@/views/Finance/index.vue')
            }
        ]
    },
    {
        // 不存在的地址，就 显示404页面
        path:'/:pathMatch(.*)*',
        component:()=>import('@/NotFind/index.vue')
    }
]



// 3.创建路由实例对象 =》 底层代码 方法
const router = createRouter({
    // 4. 内部提供了 history 模式的实现。为了简单起见，我们在这里使用 hash 模式。
    history: createWebHistory(),
    routes, //对象缩写
})

// console.log('router--',router);

export default router;
//需要到 main.ts中进行注册 =》如果你不注册，在这个项目的 .vue文件

  //不用使用  import{useRouter,useRoute} from 'vue-router'
